import { Routes, Route } from 'react-router-dom'
import Home from './pages/home'
import Literacy from './pages/literacy'
import HanZi from './pages/汉字'
import './assets/scss/common.scss'
import { useNavigate } from 'react-router-dom'
import { useEffect, useState } from 'react'
window.store = {}

function App() {

  const navigate = useNavigate()
  const [loading, setLoading] = useState(true)

  useEffect(() => {
    window.store = { ...window.store, navigate }
    setLoading(false)
    pageResize()
  }, [])


  if (loading) return null
  return (
    <Routes>
      <Route path="/" element={<Home />} />
      <Route path="/hanZi" element={<HanZi />} />
      <Route path="/literacy/:name" element={<Literacy />} />
    </Routes>
  )
}

export default App

//页面缩放
function pageResize() {
  const { innerHeight: pageH, innerWidth: pageW } = window
  let isWider = pageW / pageH > 1280 / 720
  let [scaleW, scaleH] = [pageW / 1280, pageH / 720]
  let $root = document.getElementById('root')
  if (isWider) {
    $root.style.width = pageH * 16 / 9 + 'px'
  } else {
    $root.style.height = pageW * 9 / 16 + 'px'
  }
   let scale = isWider ? scaleH : scaleW;
  // switch (Cfg.zoomMode) {
  // case "contain":
  //   if (isWider) {
  //     $container.css({ width: pageH * Cfg.designW / Cfg.designH, height: '100%' });
  //   } else {
  //     $container.css({ height: pageW * Cfg.designH / Cfg.designW, width: '100%' });
  //   }
  //   break;
  // case 'cover':
  //     $("html,body").css('overflow', 'initial');
  //     if (isWider) {
  //         $container.css({height: pageW * Cfg.designH / Cfg.designW, width: '100%'});
  //     } else {
  //         $container.css({width: pageH * Cfg.designW / Cfg.designH, height: '100%'});
  //     }
  //     scale = isWider ? scaleW : scaleH;
  //     break;
  // case 'stretch':
  //     scale = isWider ? scaleH : scaleW;
  //     $container.css({width: '100%'}, {height: '100%'});
  //     break;
  // }
  // $("html").css("font-size", scale * 16 + "px").css("opacity", 1);
  document.getElementsByTagName('html')[0].style.fontSize = scale * 16 + "px"
  // notebookOptim = !(Cfg.notebookOptim === false || scale > .75);
  // console.log("~~~~~~~~~窗口高度：" + pageH + ",\n宽度:" + pageW + " \nbody字号：" + scale)
}